<!DOCTYPE html>
<html>

  <head>
    <meta charset="UTF-8">
    <title>namespaces list</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="/static/super_cmdb/css/font.css">
    <link rel="stylesheet" href="/static/super_cmdb/css/xadmin.css">

  </head>

  <body class="layui-anim layui-anim-up">
    <div class="x-nav">
      <span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">用户列表</a>
        <a>
          <cite>导航元素</cite></a>
      </span>
      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:33px">ဂ</i></a>
    </div>
    <div class="x-body">
      <xblock>
        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
        <button class="layui-btn" onclick="x_admin_show('添加用户','/super_cmdb/user_add/',600,400)"><i class="layui-icon"></i>添加</button>
        <span class="x-right" style="line-height:40px">共有node：{{ nodes_list.len }} 个</span>
      </xblock>
      <table class="layui-table" id="table1">
        <thead>
          <tr>
            <th>
            <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
            </th>
            <th>NAME</th>
            <th>STATUS</th>
            <th>操作</th>
        </thead>
        <tbody>
            {% for namespace in namespaces_list %}
              <tr>
                <td style="width: 20px;">
                    <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='{{ user.id }}'><i class="layui-icon">&#xe605;</i></div>
                </td>
                <td>
                    <span style="background-color: #1caff3;color: white;border-radius: 2px;padding: 5px;">{{ namespace.metadata.name }}</span>
                </td>
                <td>{{ namespace.status.phase }}</td>
{#                <td>{{ user.user_birthday|date:"Y-m-d" }}</td>#}
                <td class="td-manage">

                  <a title="编辑"  onclick="x_admin_show('编辑','/super_cmdb/user_edit-{{ user.id }}',900,600)" href="javascript:;">
                    <i class="layui-icon">&#xe642;</i>
                  </a>

                  <a title="删除" onclick="member_del(this,'{{ user.id }}')" href="javascript:;">
                    <i class="layui-icon">&#xe640;</i>
                  </a>
                </td>
              </tr>
            {% endfor %}
        </tbody>
      </table>

        <div class="page">
            {% for page_str in page_list %}
                {{ page_str|safe }}
            {% endfor %}
        </div>

    </div>
    <script type="text/javascript" src="/static/super_cmdb/js/jquery.min.js"></script>
    <script type="text/javascript" src="/static/super_cmdb/lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/super_cmdb/js/xadmin.js"></script>
    <script src="/static/super_cmdb/js/jquery.min.js"></script>
    <script src="/static/super_cmdb/js/jquery.cookie.js"></script>
    <script src="/static/super_cmdb/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/static/super_cmdb/js/jquery.cookie.js"></script>
    <script>
        //表格选中着色
        var trs = document.getElementById('table1').getElementsByTagName('tr');
        window.onload = function(){
            for( var i=0; i<trs.length; i++ ){
                trs[i].onmousedown = function(){
                    tronmousedown(this);
                }
            }
        };
        function tronmousedown(obj){
            for( var o=0; o<trs.length; o++ ){
                if( trs[o] == obj ){
                    trs[o].style.backgroundColor = 'rgb(174, 212, 234)';
                }
                else{
                    trs[o].style.backgroundColor = '';
                }
            }
        }


            $(function () {
				$.ajaxSetup({
					beforeSend:function (xhr,settings) {
						xhr.setRequestHeader("X-CSRFtoken",$.cookie("csrftoken"));
					}
				})
			});

            $(function () {
               var v = $.cookie("per_page_count");
               console.log(v)
               $("#pg").val(v);
            });
            function changePageSize(ths) {
                var current_page = $(ths).val();
                console.log(current_page);
                $.cookie("per_page_count", current_page);
                location.reload();
            }


      layui.use('laydate', function(){
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
          elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
          elem: '#end' //指定元素
        });
      });

       /*用户-停用*/
      function member_stop(obj,id){
          layer.confirm('确认要停用吗？',function(index){

              if($(obj).attr('title')=='启用'){

                //发异步把用户状态进行更改
                $(obj).attr('title','停用')
                $(obj).find('i').html('&#xe62f;');

                $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
                layer.msg('已停用!',{icon: 5,time:1000});

              }else{
                $(obj).attr('title','启用')
                $(obj).find('i').html('&#xe601;');

                $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
                layer.msg('已启用!',{icon: 5,time:1000});
              }

          });
      }

      /*用户-删除*/
      function member_del(obj,id){
          layer.confirm('确认要删除吗？',function(index){
              //发异步删除数据
              var url = "/super_cmdb/user_del/";
              //console.log(url);
              $.ajax({
                    url: url,
                    type: "POST",
                    //data: $('#layui-form').serialize(),
                    data: {"user_id":id},
                    success: function (data) {
                        //console.log(data);
                    }
                });
              $(obj).parents("tr").remove();
              layer.msg('已删除!',{icon:1,time:1000});
          });
      }



      function delAll (argument) {

        var data = tableCheck.getData();

        layer.confirm('确认要删除选中项吗？'+data,function(index){
            //捉到所有被选中的，发异步进行删除
            var url = "/super_cmdb/user_del/";
              $.ajax({
                    url: url,
                    type: "POST",
                    //data: $('#layui-form').serialize(),
                    data: {"user_id":JSON.stringify(data)}, //将data转换成字符串才能提交到后端
                    success: function (data) {
                        //console.log(data);
                    }
                });
            layer.msg('删除成功', {icon: 1});
            $(".layui-form-checked").not('.header').parents('tr').remove();
        });
      }
    </script>
  </body>

</html>
